<template>
	<body-wrap isFlex>
		<div class="formApplyBox">
			<div class="fromItem">
				<label><i class="xing">*</i>姓名：</label>
				<input type="text" placeholder="输入姓名" v-model="fromData.name"/>
			</div>
			<div class="fromItem">
				<label><i class="xing">*</i>电话：</label>
				<input type="text" placeholder="输入电话" v-model="fromData.phone"/>
			</div>
			<div class="fromItem">
				<label><i class="xing">*</i>公司：</label>
				<input type="text" placeholder="输入所在公司" v-model="fromData.company"/>
			</div>
			<div class="fromItem">
				<label><i class="xing">*</i>职业：</label>
				<input type="text" placeholder="输入所属职业" v-model="fromData.industry"/>
			</div>
			<div class="fromItem">
				<label><i class="xing">*</i>职位：</label>
				<input type="text" placeholder="输入担任的职位" v-model="fromData.jobs"/>
			</div>
			<div class="fromItem">
				<label>获得的职称：</label>
				<textarea placeholder="输入获得的职称（多个以都逗号隔开）" v-model="fromData.positional"></textarea>
			</div>
			<div class="fromItem">
				<label>获得的荣誉：</label>
				<textarea placeholder="输入获得的荣誉（多个以都逗号隔开）" v-model="fromData.honors"></textarea>
			</div>
			<div class="fromItem">
				<label>擅长领域：</label>
				<textarea placeholder="输入擅长领域（多个以都逗号隔开）" v-model="fromData.speciality"></textarea>
			</div>
			<div class="fromItem">
				<label>社会职务：</label>
				<textarea placeholder="输入社会职务（多个以都逗号隔开）" v-model="fromData.pastJobs"></textarea>
			</div>
			<div class="fromItem">
				<label><i class="xing">*</i>个人简介：</label>
				<textarea placeholder="输入个人简介" v-model="fromData.tearcherIntroduction"></textarea>
			</div>
		</div>
		<template #footer>
			<div class="ftBtnBox">
				<div class="myBtn" @click="save">保存</div>
			</div>
		</template>
	</body-wrap>
</template>

<script>
	import {defineComponent,reactive,toRefs,onMounted,getCurrentInstance,computed} from 'vue'
	import {onLoad,onShow} from '@dcloudio/uni-app'
	import { useStore } from 'vuex'
	import bodyWrap from "@/components/bodyWrap/index.vue"
	import {updateUserInfo} from "@/api/base.js"
	import {toast,checkMobile} from '@/utils/common.js'
	export default defineComponent({
		components:{
			bodyWrap
		},
		props:{
		
		},
		setup(props,context) {
			const store = useStore()
			const {proxy} = getCurrentInstance()
			
			const state = reactive({
				userInfo:computed(()=>store.state.base.userInfo),
				fromData:{}
			})
			
			onMounted(()=>{
				console.log("userInfo:",state.userInfo)
				state.fromData = state.userInfo
			})
			
			const save = async ()=>{
				state.fromData.type = 1
				// if(!state.fromData.selfAvatar){
				// 	return toast('请上传头像')
				// }else 
				if(!state.fromData.name){
					return toast('请输入姓名')
				}else if(!state.fromData.phone){
					return toast('请输入联系电话')
				}else if(state.fromData.phone && !checkMobile(state.fromData.phone)){
					return toast('手机号输入有误')
				}else if(!state.fromData.company){
					return toast('请输入所在公司')
				}else if(!state.fromData.industry){
					return toast('请输入职业')
				}else if(!state.fromData.jobs){
					return toast('请输入所担任的职位')
				}else if(!state.fromData.tearcherIntroduction){
					return toast('请输入个人简介')
				}
				const res = await updateUserInfo(state.fromData)
				if(res.code==200){
					toast('申请成功！')
				}else{
					toast('保存出差了！')
				} 
			}
			
			return {
				...toRefs(state),
				save
			}
		}
	})
</script>

<style lang="scss" scoped>
	.formApplyBox{
		padding: 20rpx;
		.fromItem{
			&+.fromItem{
				margin-top: 25rpx;
			}
			label{
				display: flex;
				align-items: center;
				font-size: 28rpx;
				font-weight: bold;
				padding: 0 0 10rpx 0;
				i,.xing{
					color: red;
				}
			}
			input{
			   box-sizing: border-box;
			   width: 100%;
			   height: 80rpx;
			   line-height: 80rpx;
			   padding: 20rpx;
			   border: 0;
			   background: #fff;
			   border-radius: 5rpx;
			   color: #333;
			   font-size: 28rpx;
		   }
		   textarea{
			   box-sizing: border-box;
			   border: 0;
			   width: 100%;
			   padding: 20rpx;
			   background: #fff;
			   height: 300rpx;
			   border-radius: 5rpx;
			   color: #333;
			   font-size: 28rpx;
		   }
		}
	}
	.ftBtnBox{
		padding: 20rpx;
	}
</style>
